• 按功能模块化
  • 统一资源路径加载
  • 配置文件

项目使用require + jquery，另外不间断引入一些其它的插件和组件如layer,mui,sui.
另外自己封装了一些功能性的js，用于复用大大加快了开发效率，并且获得了更好的代码结构。
前端使用单独的配置文件：config.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var config = {
	serviceHost : 'http://easy.com',
	srcUrl: 'http://m.test.taozhenwang.com:800/public/201504',
	pubUrl: '/js/lib/public',
	ngMenu: 'http://cdn.bootcss.com/angular.js/1.5.7/',
	jqUrl: 'http://cdn.bootcss.com/jquery/1.11.1/jquery.min',
	getUrl: function(url){
		return config.serviceHost + url;
	},
	init: function(){
		config.pubUrl = config.srcUrl + config.pubUrl;
	}
}
config.init();
require.config({
	paths: {
		'ng': config.ngMenu + 'angular.min',
		'jq': [config.jqUrl, config.srcUrl + '/js/lib/jquery-1.11.1.min'],
		'pub': config.srcUrl+'/js/lib/public'
	}
});

这里是copy了新项目（使用了angular）的配置文件过来配置的。
页面用require引导加载的js文件中，先用一句代码
require.config({paths: {'config': '../config'}});
把配置文件加载进来，然后下面：

1
2
3
4
5
6
7
require(['config'], function (){
	require(['jq'],function(){
			require(['pub/public'],function(){
        //尽情书写你的代码吧
			});
	});
});

将配置文件作为最外层的依赖模块require(['config'], function (){});，加载完后，配置文件中require的配置即生效，再依次加载config.js中配置的jquery和public目录下的public.js.
（关于require.js的目录配置和文件配置，建议通读一次require文档，以期对其它特性也有一定的了解）

1. 按功能模块化，封装包括服务的功能，封装的时候要注意可扩展性。

  • 先已有的有phone-email.js